<template>
  <div id="apply-repeat">
    <!-- 重复申请 -->
    <div class="deposit-content">
      <div class="top-bg">
        <van-nav-bar class="header"
                     fixed
                     :border="false"
                     @click-right="diffBack">
          <div class="title"
               slot="title">{{title}}</div>
          <div slot="right"
               class="right">了解</div>
        </van-nav-bar>
      </div>
      <div class="reset-wrapper">
        <div class="reset-content">
          <div class="top-case">
            <div class="img-case"><img src="@/assets/img/public/success.png"
                   alt=""></div>
            <div class="img-title">您已提交过申请</div>
            <div class="up-tips">请尽快向"<span>zhaopin@tuxiaozhu.com</span>"发送您的“个人简历+近期优秀作品”，邮件名称请注明为“姓名+电话+工作年限”。</div>
          </div>
          <div class="bottom-case">
            <div class="btn-case">
              <div class="left-btn">图小助官方邮箱</div>
              <input type="text"
                     class="email-case"
                     value="zhaopin@tuxiaozhu.com"
                     id="order"
                     @click="CopyNum('order')"
                     readonly="true">
              <div class="right-case"
                   @click="CopyNum('order')">复制</div>
            </div>
            <div class="tips-case">平台会在3个工作日内审核并向您邀约面试</div>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>
<script>
export default {
  components: {},
  data() {
    return {
      title: "申请入驻"
    };
  },
  created() {},
  methods: {
    diffBack() {
      this.$router.push("/designer/personalCenter");
    },
    CopyNum(address) {
      document.getElementById(address).focus();
      let num = document.getElementsByTagName("input")[0];
      num.setSelectionRange(0, num.value.length); // 选择对象
      document.execCommand("Copy");
      this.$toast('复制成功')
    }
  }
};
</script>
<style lang="scss" scoped>
#apply-repeat {
  position: absolute;
  width: 100%;
  height: 100%;
  background: #f9f9f9;
  .deposit-content {
    position: relative;
    width: 100%;
    height: 100%;
    .top-bg {
      width: 100%;
      background: #fff;
      border-bottom-left-radius: 0.5rem;
      border-bottom-right-radius: 0.5rem;
      .header {
        background: #5e8efe;
        color: #ffffff;
        height: 0.92rem;
        .title {
          color: #ffffff;
          font-size: 0.35rem;
        }
        .right {
          font-size: 0.32rem;
          height: 0.92rem;
          line-height: 1rem;
        }
      }
    }
    .reset-wrapper {
      position: fixed;
      width: calc(100% - 0.48rem);
      height: calc(100% - 1.4rem);
      margin: 0.24rem;
      box-sizing: border-box;
      top: 0.92rem;
      left: 0;
      right: 0;
      overflow-y: scroll;
      bottom: 0;
      background: #fff;
      .reset-content {
        width: 100%;
        // height: 100%;
        .top-case {
          margin: 0 auto;
          margin-top: 1rem;
          .img-case {
            width: 1.86rem;
            height: 1.86rem;
            margin: 0 auto;
            img {
              width: 1.86rem;
              height: 1.86rem;
            }
          }
          .img-title {
            width: 100%;
            margin-top: 0.5rem;
            text-align: center;
            color: #282828;
            font-size: 0.3rem;
            font-family: PingFangSC-Regular;
            font-weight: 400;
            line-height: 0.42rem;
          }
          .up-tips {
            box-sizing: border-box;
            width: 100%;
            color: #656565;
            margin-top: 0.2rem;
            padding: 0 0.68rem;
            font-size: 0.24rem;
            font-family: PingFangSC-Regular;
            font-weight: 400;
            span {
              color: #5e8efe;
            }
          }
        }
        .bottom-case {
          width: 100%;
          margin-top: 4.5rem;
          .btn-case {
            position: relative;
            margin: 0 0.53rem;
            width: calc(100% - 1.06rem);
            height: 0.91rem;
            line-height: 0.91rem;
            background: #f2f6fc;
            padding: 0 0.33rem;
            box-sizing: border-box;
            display: flex;
            div {
              display: inline-block;
            }
            .left-btn {
            }
            .email-case {
              flex: 1;
              text-align: center;
              color: #5e8efe;
              border: none;
              background: transparent;
            }
            .right-case {
              float: right;
            }
          }
          .tips-case {
            text-align: center;
            color: #9b9ea5;
            font-size: 0.24rem;
            font-family: PingFangSC-Regular;
            font-weight: 400;
            margin: 0.46rem 0;
          }
        }
      }
    }
  }
}
</style>
